<template>
  <div
    class="diy_edit sensitive_vocabulary_edits sensitive_vocabulary"
    id="sensitive_vocabulary_edit"
  >
    <el-form
      :model="form"
      ref="ruleFormRef"
      :rules="rules"
      label-width="auto"
      class="edit_sensitive_vocabulary_form"
      size="large"
    >
      <el-row class="row_ce">
        <el-col :xs="24" :sm="24" :lg="24" class="el_form_item_warp">
          <el-form-item label="敏感词汇" prop="sensitive_vocabulary">
            <el-input
              id="sensitive_vocabulary"
              v-model="form['sensitive_vocabulary']"
              placeholder="请输入敏感词汇"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="footer">
        <el-button type="primary" @click="Onsubmit" size="large"
          >提交</el-button
        >
        <el-button @click="cancel()" size="large">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script setup>
import { ElMessage } from "element-plus";
import { ref, onMounted } from "vue";
import { $post, $get } from "@/api/Api.js";
import storageHelper from "@/libs/StorageHelper";
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import {
  $get_auth,
  func,
  paramsFun,
  $fullUrl,
  formatDate,
  $banseUrl,
  $check_action,
  $getUrlParams,
  filterSensitiveWords,
} from "@/utils/utils.js";
let router = useRouter();
let store = useStore();
let token = storageHelper.getToken() || null;
let UserInfo = storageHelper.getUserInfo();
let sensitive_vocabulary_id = $getUrlParams().sensitive_vocabulary_id;
let url_add = ref("/api/sensitive_vocabulary/add");
let url_set = ref("/api/sensitive_vocabulary/set");
let url_get_obj = ref("/api/sensitive_vocabulary/get_obj");
let url_upload = ref("/api/sensitive_vocabulary/upload");
let title = ref("sensitive_vocabulary");
let field = ref("sensitive_vocabulary_id");

let form = ref({
  sensitive_vocabulary: "", // 敏感词汇
  sensitive_vocabulary_id: 0, // ID
});

let ruleFormRef = ref(null);
let rules = ref({
  sensitive_vocabulary: [
    {
      required: true,
      message: "敏感词汇不能为空",
      trigger: "blur",
    },
  ],
});

// 点击取消
let cancel = () => {
  router.go(-1);
};
// 点击提交
let Onsubmit = async () => {
  let valid = await ruleFormRef.value.validate();
  if (valid) {
    // 提交表单
    if (sensitive_vocabulary_id) {
      delete form.value.update_time;
      $post(
        "/api/sensitive_vocabulary/set?sensitive_vocabulary_id=" +
          sensitive_vocabulary_id,
        form.value
      ).then((res) => {
        if (res.result) {
          ruleFormRef.value.resetFields();
          router.push("/home/sensitive_vocabulary/table");
          ElMessage.success("提交成功！");
        } else if (res.error) {
          ElMessage.error(res.error.message);
        }
      });
    } else {
      $post("/api/sensitive_vocabulary/add", form.value).then((res) => {
        if (res.result) {
          ruleFormRef.value.resetFields();
          router.push("/home/sensitive_vocabulary/table");
          ElMessage.success("提交成功！");
        } else if (res.error) {
          ElMessage.error(res.error.message);
        }
      });
    }
  } else {
    ElMessage.error(msg);
  }
};
// 获取留言详情
let get_sensitive_vocabulary_obj = async () => {
  var list = await $get(
    "/api/sensitive_vocabulary/get_obj?sensitive_vocabulary_id=" +
      sensitive_vocabulary_id
  );
  form.value = list.result.obj;
};
onMounted(() => {
  if(sensitive_vocabulary_id){
    get_sensitive_vocabulary_obj();
  }
 
});
</script>

<style scoped lang="less">
.diy_edit {
  width: 100%;
  .edit_sensitive_vocabulary_form {
    max-width: 60%;
    margin: 90px auto;
    .fn {
      width: 100%;
    }
  }
  img {
    width: 100px;
    height: 100px;
  }
  .edit_list_sensitive_vocabulary_sell {
    width: 80%;
    margin: 90px auto;
  }
  .footer {
    text-align: center;
  }
}
</style>
